Skip to main content

Lifecycle Methods

Catalyst provides several methods to handle different stages of the SSR lifecycle, allowing for more fine grain control over the flow

Lifecycle Benefits

🔧 Fine Control

Handle specific stages of the SSR process with precision

🐛 Error Handling

Comprehensive error handling at each lifecycle stage

📊 Monitoring

Track and monitor application performance and errors

Lifecycle Methods Demo

This demo shows Catalyst's SSR lifecycle methods and their execution order. Click the buttons below to simulate different lifecycle scenarios.

Lifecycle Flow

1

preServerInit

Before server starts

2

onRouteMatch

After route matching

3

onFetcherSuccess

After data fetching

4

Render

Component rendering

Events Log

No events logged yet. Click a button above to simulate lifecycle.

Watch the events appear in real-time as the lifecycle progresses.

Code Example

Server Lifecycle Methods (server/index.js)

// server/index.js
export const preServerInit = () => {
  console.log('Server initialization started');
  // Initialize server configurations
  // Set up middleware
  // Configure logging
}

export const onServerError = (error) => {
  console.error('Server error:', error);
  // Handle server startup failures
  // Log critical errors
  // Send notifications
}

export const onRouteMatch = (route) => {
  console.log('Route matched:', route);
  // Handle route matching logic
  // Set up route-specific middleware
  // Validate route parameters
}

export const onFetcherSuccess = (data) => {
  console.log('Data fetched successfully:', data);
  // Process fetched data
  // Transform data for rendering
  // Cache results
}

export const onRenderError = (error) => {
  console.error('Render error:', error);
  // Handle component rendering errors
  // Fallback to error page
  // Log rendering issues
}

export const onRequestError = (error) => {
  console.error('Request error:', error);
  // Handle request-level errors
  // Return appropriate error responses
  // Log request failures
}

Lifecycle Functions

Catalyst provides the following lifecycle methods that can be defined in and exported from server/index.js:

  1. preServerInit - Triggers before starting the server.
  2. onServerError - Triggered if the SSR server fails to start or encounters a critical error. Useful for handling server initialization issues.
  3. onRouteMatch - Called after route matching attempts, regardless of whether a match was found or not. This method enables you to handle both successful and failed route matches
  4. onFetcherSuccess - Triggered after running a container's serverFetcher (currently running for both success and failure case)
  5. onRenderError - Executes when the rendering process encounters an error. This allows you to handle any failures during component rendering.
  6. onRequestError - Executes if any error occurs while handling the document request (think of it like the outer most catch block)